<template>
    <d2-container :class="{'page-compact':crud.pageOptions.compact}">
        <d2-crud-x
                ref="d2Crud"
                v-bind="_crudProps"
                v-on="_crudListeners"
        @caseTest="castAllTest"
        @showResult="showResultView">

            <div slot="header">
              <crud-search ref="search" :options="crud.searchOptions" @submit="handleSearch" >
                  <template slot="suffix">
            <el-dropdown split-button type="primary" size="small">
              选择环境
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item v-for="item in env_list" :key="item.id" @click.native="handleEnvChange(item)">
                  {{ item.env_name }}
                </el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
            <el-tag style="margin-left: 10px" type="warning">{{ select_env ? '当前环境：' + select_env : '请选择环境' }}</el-tag>
          </template>

              </crud-search>
                <el-button size="small" type="primary" @click="addRow"><i class="el-icon-plus"/> 新增</el-button>
                <el-button size="small" type="danger" @click="batchDelete"><i class="el-icon-delete"></i> 批量删除</el-button>
                <crud-toolbar v-bind="_crudToolbarProps" v-on="_crudToolbarListeners"/>
            </div>
            <span slot="PaginationPrefixSlot" class="prefix" >
                <el-button class="square" size="mini" title="批量删除"   @click="batchDelete" icon="el-icon-delete" :disabled="!multipleSelection || multipleSelection.length===0"  />
            </span>

          <template slot="cronSlot" slot-scope="scope">
            <el-tag size="mini">{{scope.row['cron_str']}}</el-tag>
          </template>
        </d2-crud-x>

      <el-drawer
        title="测试结果"
        :visible.sync="showResult"
        direction="rtl"
        size="70%"
        >
        <template slot="title">
        </template>
        <div>
          <apiResult v-if="showResult" :case-obj="caseObj"></apiResult>
<!--          <rolePermission v-if="rolePermissionShow" :role-obj="roleObj"></rolePermission>-->
        </div>
      </el-drawer>
    </d2-container>
</template>

<script>
import { crudOptions } from './crud'
import { d2CrudPlus } from 'd2-crud-plus'
import * as api from './api'
import * as evnApi from '@/views/system/api_envinfo/api'
import apiResult from '@/views/system/api_result'
export default {
  name: 'api_testcase',
  components: { apiResult },
  mixins: [d2CrudPlus.crud],
  data () {
    return {
      env_list: [],
      select_env: '',
      select_obj: undefined,
      showResult: false,
      caseObj: undefined
    }
  },
  methods: {
    getCrudOptions () {
      return crudOptions(this)
    },
    pageRequest (query) {
      return api.GetList(query)
    },
    addRequest (row) {
      console.log(row.row)
      if (!this.select_env) {
        this.$message.error('请选择环境')
        return
      }
      const toObj = row
      toObj.env = this.select_obj
      console.log(toObj)
      return api.AddObj(toObj)
    },
    updateRequest (row) {
      console.log(row.row)
      if (!this.select_env) {
        this.$message.error('请选择环境')
        return
      }
      const toObj = row
      toObj.env = this.select_obj
      console.log(toObj)
      return api.UpdateObj(toObj)
    },
    delRequest (row) {
      return api.DelObj(row.id)
    },
    batchDelRequest (ids) {
      return api.BatchDel(ids)
    },
    infoRequest (row) {
      return api.GetObj(row.id)
    },
    castAllTest (row) {
      console.log(row)
      console.log(row.row)
      if (!this.select_env) {
        this.$message.error('请选择环境')
        return
      }
      const to_obj = row.row
      to_obj.env = this.select_obj
      console.log(to_obj)
      return api.castTest(to_obj).then(res => {
        this.$message.success(res.msg)
        this.doRefresh()
      })
    },
    handleEnvChange (item) {
      console.log(item)
      this.select_env = item.env_name
      this.select_obj = item
    },
    showResultView (scope) {
      console.log(scope)
      this.showResult = true
      this.caseObj = scope.row
    }
  },
  mounted () {
    evnApi.GetList().then(res => {
      console.log(res.data.data)
      this.env_list = res.data.data
      for (let i = 0; i < this.env_list.length; i++) {
        // 如果env_list数据中有默认环境，则默认选中
        if (this.env_list[i].default === true) {
          this.select_env = this.env_list[i].env_name
          this.select_obj = this.env_list[i]
          break
        }
      }
    })
  }
}
</script>
